﻿<local:TileImageBase x:Class="EmperialApps.WeatherSpark.Agent.TileWideFlipImage"
                     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                     xmlns:local="clr-namespace:EmperialApps.WeatherSpark.Agent"
                     Height="360"
                     Width="744"
                     FontFamily="Segoe WP">
    <Grid x:Name="ForecastPanel">
        <Grid.RowDefinitions>
            <RowDefinition Height="24" />
            <RowDefinition Height="80" />
            <RowDefinition Height="24" />
            <RowDefinition x:Name="GraphRow"
                           Height="160" />
            <RowDefinition Height="24" />
            <RowDefinition Height="24" />
            <RowDefinition Height="24" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="248" />
            <ColumnDefinition Width="248" />
            <ColumnDefinition Width="248" />
        </Grid.ColumnDefinitions>
        <Grid.Resources>
            <Style x:Key="ExtremeTemperatureLabel"
                   TargetType="TextBlock">
                <Setter Property="Grid.Row"
                        Value="1" />
                <Setter Property="FontSize"
                        Value="32" />
                <Setter Property="FontWeight"
                        Value="Light" />
                <Setter Property="Foreground"
                        Value="White" />
                <Setter Property="HorizontalAlignment"
                        Value="Right" />
            </Style>

            <Style x:Key="LowTemperatureLabel"
                   BasedOn="{StaticResource ExtremeTemperatureLabel}"
                   TargetType="TextBlock">
                <Setter Property="Margin"
                        Value="0,0,4,3" />
                <Setter Property="VerticalAlignment"
                        Value="Bottom" />
                <Setter Property="Text"
                        Value="-80°" />
            </Style>

            <Style x:Key="HighTemperatureLabel"
                   BasedOn="{StaticResource ExtremeTemperatureLabel}"
                   TargetType="TextBlock">
                <Setter Property="Margin"
                        Value="0,3,4,0" />
                <Setter Property="VerticalAlignment"
                        Value="Top" />
                <Setter Property="Text"
                        Value="134°" />
            </Style>
        </Grid.Resources>

        <Grid HorizontalAlignment="Center"
              Grid.Column="0"
              Grid.Row="1">
            <TextBlock x:Name="LowTemperatureYesterdayLabel"
                       Style="{StaticResource LowTemperatureLabel}" />
            <TextBlock x:Name="HighTemperatureYesterdayLabel"
                       Style="{StaticResource HighTemperatureLabel}" />
        </Grid>

        <TextBlock x:Name="CurrentTemperatureLabel"
                   Grid.Column="1"
                   Grid.Row="1"
                   Margin="4,-4,0,0"
                   FontSize="70"
                   Foreground="Black"
                   HorizontalAlignment="Left"
                   VerticalAlignment="Center"
                   Text="134°C" />
        <TextBlock x:Name="LowTemperatureTodayLabel"
                   Style="{StaticResource LowTemperatureLabel}"
                   Grid.Column="1" />
        <TextBlock x:Name="HighTemperatureTodayLabel"
                   Style="{StaticResource HighTemperatureLabel}"
                   Grid.Column="1" />

        <Grid HorizontalAlignment="Center"
              Grid.Column="2"
              Grid.Row="1">
            <TextBlock x:Name="LowTemperatureTomorrowLabel"
                       Style="{StaticResource LowTemperatureLabel}" />
            <TextBlock x:Name="HighTemperatureTomorrowLabel"
                       Style="{StaticResource HighTemperatureLabel}" />
        </Grid>

        <Border Grid.Column="1"
                Grid.RowSpan="7"
                Margin="0,-1"
                BorderBrush="#80000000"
                BorderThickness="1,0" />

        <Grid Grid.ColumnSpan="3"
              Grid.Row="3"
              Margin="-0.5,0">
            <Rectangle x:Name="NightBackground"
                       Fill="#80333333">
                <Rectangle.Clip>
                    <PathGeometry />
                </Rectangle.Clip>
            </Rectangle>

            <Line x:Name="ExtremeLine"
                  Stroke="#80000000" />

            <Polyline x:Name="TemperatureTrace"
                      Stretch="None"
                      Stroke="White"
                      StrokeEndLineCap="Square"
                      StrokeStartLineCap="Square"
                      StrokeThickness="4" />

            <Ellipse x:Name="CurrentTimeMarker"
                     Height="12"
                     Margin="-6"
                     Width="12"
                     Fill="Black"
                     HorizontalAlignment="Left"
                     VerticalAlignment="Top">
                <Ellipse.RenderTransform>
                    <TranslateTransform />
                </Ellipse.RenderTransform>
            </Ellipse>
        </Grid>

        <TextBlock x:Name="TileTitle"
                   Grid.ColumnSpan="3"
                   Grid.Row="5"
                   Margin="18,-13"
                   FontSize="36"
                   Foreground="White">
            Austin, TX
        </TextBlock>
    </Grid>
</local:TileImageBase>
